
    <script type="text/x-template" id="TopMenu">
    <div>
        <div :class="'main-form '+ ClassName">
 

                <mu-appbar id="topmenu" class="ms-appbar" color="primary">
                
               
                <div class="ms-appbar-title">
 {{title}}   
 </div>
  <mu-button v-if="GetHome==true" @click="previous" icon slot="left" class="ms-small-screen">
                          <mu-icon value="chevron_left" ></mu-icon>
                        </mu-button>
         <template v-for="Menu in Menus"  >
  <template v-if="Menu.active">
<mu-button   slot="left"
     color="warning"  
     class="ms-large-screen"
     large
       @click="SelectMenu(Menu)" 
      > 
      {{Menu.title}}
     </mu-bottom> 
         </template>  
         <template v-else>
<mu-button   slot="left" 
          color="warning" 

     class="ms-large-screen"
     flat 
     large
       @click="SelectMenu(Menu)"  
      > 
      {{Menu.title}}
     </mu-bottom> 
         </template>  
         </template>  
 
<mu-text-field 
class="ms-appbar-search ms-large-screen"
slot="right" 
 v-on:keyup.enter="Search"
  v-model="value"   
         action-icon="search"  
         ></mu-text-field>

  
<mu-button @click="ShowMsMenu" icon slot="right" class="ms-small-screen">
                          <mu-icon value="menu" ></mu-icon>
                        </mu-button>
                      </mu-appbar>
                   
    <router-view></router-view>

     
     <div class="ms-bottom-nav">
     <mu-bottom-nav  shift>
    <mu-bottom-nav-item value="home" title="首页" icon="home"></mu-bottom-nav-item> 
    <mu-bottom-nav-item value="face" title="关于" icon="face"></mu-bottom-nav-item>
  </mu-bottom-nav>
      </div>  
       </div>  
       
      
      
        <mu-drawer :docked="MsMenu.docked" :open.sync="MsMenu.Show" z-depth="10" :right="MsMenu.right">
    <mu-list value=3>

         <template v-for="Menu in Menus" >  
       <mu-list-item 
       :class="Menu.active?'mu-warning-color':''"  
       @click="SelectMenu(Menu,'ms-menu')" 
       button :exact-active-class="Menu.active?'active':''">
                             
               <mu-list-item-content> <mu-list-item-title >
                              {{Menu.title}}
                              </b-list-item-title>
      </mu-list-item-content>
      </mu-list-item-action>
        <mu-badge content="12"></mu-badge>
      </mu-list-item-action>
                              </mu-list-item> 

         </template>  
    </mu-list>
  </mu-drawer> 
  </div> 
    </script>
